const path = require('path')

const HtmlWebpackPlugin = require('html-webpack-plugin')
const VueLoaderPlugin = require('vue-loader/dist/plugin').default
const MiniCssExtractPlugin = require('mini-css-extract-plugin')

module.exports = {
  entry: path.resolve(__dirname, "../src/main.js"),
  output: {
    filename: 'static/js/[name]_[hash:16].js',
    path: path.resolve(__dirname, '../dist'),
    publicPath: '/'
  },
  resolve: {
    extensions: ['.js', '.jsx', '.ts', '.tsx', '.vue', '.less'],
    alias: {
      '@': path.resolve(__dirname, '../src'),
      'ant-design-vue/es': path.resolve(__dirname, '../src/refer/ant-design-vue'),
      'ant-design-vue': path.resolve(__dirname, '../src/refer/ant-design-vue'),
      vue$: 'vue/dist/vue.esm-bundler.js',
    }
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: 'static/css/[name]_[chunkhash:8].css',
      chunkFilename: '[id].css',
    }),
    new HtmlWebpackPlugin({
      template: path.resolve(__dirname, '../public/index.html'),
      filename: 'index.html',
      hash: true,
      minify: {
        removeAttributeQuotes: true,
        removeComments: true,
        collapseWhitespace: true,
      }
    }),
    new VueLoaderPlugin()
  ]
}